import React, { PureComponent } from 'react'

// 类组件
class HelloWorld extends PureComponent {
  constructor() {
    super()

    this.state = {
      message: 'Hello World'
    }
  }

  changeText() {
    this.setState({
      message: '你好世界'
    })
  }

  render() {
    const { message } = this.state
    return (
      <div>
        <h2>内容：{ message }</h2>
        <button onClick={e => this.changeText()}>修改文本</button>
      </div>
    )
  }
}

function HelloWordl2(props) {
  let message = 'Hello World2'
  return (
    <div>
      <h2>内容2：{message}</h2>
      <button onClick={e => message = '你好世界'}>修改文本</button>
    </div>
  )
}

export class App extends PureComponent {
  render() {
    return (
      <div>
        <HelloWorld />
        <HelloWordl2 />
      </div>
    )
  }
}

export default App